<template>
  <div>
      <h1>defineModel</h1>
      <button @click="change">改变</button>
      <hr>
        
      <gameOne></gameOne>
      <hr>
      <!--
      v-model:msg 
      v-model后的修饰符 用defineModel来定义
        -->
         <h1>子传父：{{fmsg}}</h1>
         <h1>子传父的count:{{countStr}}</h1>

      <gameTwo v-model:msg="fmsg"
      v-model:count="countStr"></gameTwo>


      <hr>
      <gameThree></gameThree>
   
  </div>
</template>
<script setup>

import gameOne from './gameOne.vue'
import gameTwo from './gameTwo.vue'
import gameThree from './gameThree.vue'
  import {ref} from 'vue'
  // // useId 返回一个唯一的id
  //   let id=useId()
  // let change=()=>{
  //    console.log(id,"--------------------")
  // }
 
//  传给子组件的数据
let fmsg=ref('hello')

// 父传子的初始count
let countStr=ref("111")
</script>